<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>列表</title>
<link href="${cssRoot}/css/style.css" rel="stylesheet" type="text/css" />
<link href="${cssRoot}/css/laypage.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="${jsRoot}/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="${jsRoot}/js/listtable.js"></script>
<script type="text/javascript" src="${jsRoot}/js/layer.js"></script>
<script type="text/javascript" src="${jsRoot}/js/laypage.js"></script>
<script type="text/javascript" src="${jsRoot}/js/laytpl.js"></script>
<script type="text/javascript" src="${jsRoot}/js/jquery.stickytableheaders.min.js"></script>
</head>
<body>
    <jsp:include page="../navigation.jsp" />
    
    <div class="tools">
        <form method="post" id="theform" action="javascript:load_page();" style="margin: 5px;">
           <label class="searchlabel">商铺名称:</label>
           <input class="searchinput" name="storeName" type="text">
           <label class="searchlabel">审核:</label>
           <select class="searchselect" name="audit">
			  <option value="">请选择...</option>
			  <option value="1">待审核</option>
			  <option value="2">审核通过</option>
			  <option value="3">审核未通过</option>
		   </select>
		   <input type="submit" class="searchbtn1" value="搜索">
        </form>
    	<div style="overflow: hidden;">
    		<input type="button" onclick="add();" class="searchbtn2" value="添加">
    		<input type="button" onclick="listTable.remove('delete.do');"; class="searchbtn2" value="删除">
        </div>
    
    </div>
    
    <div id="view"></div>
    
    <div class="rightinfo">
    <table class="tablelist" id="table">
    	<thead>
    	<tr>
        <th width="30"><input onclick='listTable.selectAll(this, "checkboxes")' type="checkbox"/></th>
        <th width="88">操作</th>
        <th width="128">商铺名称<i class="sort"><img src="${imgRoot}/images/px.gif" /></i></th>
        <th width="234">地址</th>
        <th width="130">联系电话</th>
        <th>点击数</th>
        <th>评论数</th>
        <th>人均消费</th>
        <th>状态</th>
		<th>审核</th>
        <th>首页推荐</th>
        </tr>
        </thead>
        <tbody id="grid-data-view"></tbody>
    </table>
    </div>
    
    <div class="pagin">
    	<div id="message11" class="message" style="float:left;height: 34px;line-height: 34px;"></div>
        <div id="page11" style="float:right;"></div>
    </div>
    
    <script id="grid-data-template" type="text/html">
       {{# for(var i = 0, len = d.list.length; i < len; i++){ }}
    		<tr>
    		    <td><input name="checkboxes[]" type="checkbox" value="{{d.list[i].storeId}}" /></td>
    		    <td><a href="#" class="tablelink">查看</a>
        			<a href="javascript:listTable.remove('delete.do','{{d.list[i].storeId}}');" class="tablelink"> 删除</a>
        		</td>
        		<td>{{d.list[i].storeName}}</td>
        		<td>{{d.list[i].address}}</td>
        		<td>{{d.list[i].telephone}}</td>
        		<td>{{d.list[i].storeClick}}</td>
        		<td>{{d.list[i].commentCount}}</td>
        		<td>{{d.list[i].personConsume}}</td>
        		<td>
        		   	{{# if(d.list[i].isAppointment=='1'){ }}
					关闭
					{{# } else if(d.list[i].isAppointment=='2') { }}
					开启
					{{# } }}
        		</td>
        		<td>
        		   	{{# if(d.list[i].isAudit=='1'){ }}
					待审核
					{{# } else if(d.list[i].isAudit=='2') { }}
					审核通过
					{{# } else if(d.list[i].isAudit=='3') { }}
					审核未通过
					{{# } }}
        		</td>
        		<td>
        		   	{{# if(d.list[i].storeRecommend=='0'){ }}
					否
					{{# } else if(d.list[i].storeRecommend=='1') { }}
					是
					{{# } }}
        		</td>
    		</tr>
		{{# } }}
	</script>
    <script type="text/javascript">
    //$("#table").stickyTableHeaders();
    var offset = $('.tools').height();
    $("html:not(.legacy) table").stickyTableHeaders({fixedOffset: offset});
	//分页
	function load_page(curr){
	  $.getJSON('query.do', {
        	page: curr || 1,
        	storeName:$('#theform input[name=storeName]').val(),
        	audit:$('#theform select[name=audit]').val()
    	}, function(res){
    	  		var gettpl = document.getElementById('grid-data-template').innerHTML;
    			laytpl(gettpl).render(res, function(html){
        			$('#grid-data-view').html(html);
    	  		});
    	  		
    	  		laypage({
    				cont: 'page11',
    				pages: res.totalPages, //总页数放在某一个隐藏域，再获取。假设我们获取到的是18
    				curr: res.page,
					skip: true, //是否开启跳页
					groups: 8 ,//连续显示分页数
					last: res.totalPages,//将尾页显示为总页数。若不显示，设置false即可
    				jump: function(e, first){ //触发分页后的回调
       	 				if(!first){ //一定要加此判断，否则初始时会无限刷新
         	   				load_page(e.curr);
        					}
    					}
				});
				$("#message11").html('共<i class="blue">'+res.totalCount+'</i>条记录,第<i class="blue">'+res.page+'/'+res.totalPages+'页</i>');
    	}
      )
	}
	$(function() {load_page();});
	
	//新增
	function add(){
		layer.open({
		    type: 2,
		    title: 'layer mobile页',
		    shadeClose: true,
		    shade: 0.8,
		    scrollbar: false,//禁用父滚动条
		    area: ['700px', '400px'],
		    content: 'add.do' //iframe的url
		}); 
	}
	</script>
</body>
</html>